<template>
  <div class="shared">
    <h5 class="title_name">第三方SDK列表说明</h5>
    <div class="title">
      &nbsp;&nbsp;&nbsp;为保证药易购平台相关功能的实现和应用的安全稳定运行，我们可能会接入第三方提供的软件开发包（SDK）实现前述目的。
    </div>
    <div class="centar">
      &nbsp;&nbsp;&nbsp;我们会及时在本目录中向您公开说明接入第三方SDK最新情况。您可访问我们披露的的第三方SDK隐私政策链接以进一步了解其手机使用您个人信息的具体情况；如该第三方未针对其SDK提供的专门隐私政策，我们可能会提供其他服务相关官网的链接以便协助您了解其具体信息。目前药易购平台接入的第三方SDK情况如下：
    </div>

    <div class="tab">
      <div class="tab_qin">第三方共享清单</div>
      <table style="width:100%" id="cust">
        <tr>
          <th>序号</th>
          <th>SDK名称</th>
          <th>第三方名称</th>
          <th>使用目的</th>
          <th>处理方式</th>
          <th>个人信息</th>
          <th>第三方隐私政策</th>
        </tr>
        <tr v-for="(user, index) in users" :key="index">
          <td>{{ index + 1 }}</td>
          <td>{{ user.name }}</td>
          <td>{{ user.tripartite }}</td>
          <td>{{ user.objective }}</td>
          <td>{{ user.mode }}</td>
          <td class="information">{{ user.information }}</td>
          <td class="policy">{{ user.policy }}</td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      user: {
        name: "",
        tripartite: "",
        objective: "",
        mode: "",
        information: "",
        policy: ""
      },
      users: [
        {
          name: "微信",
          tripartite: "深圳市腾讯计算机系统有限公司",
          objective: "用于微信登录、支付、分享",
          mode: "采取去标识化和加密的安全处理方式",
          information:
            "设备版本、系统版本、生成ID、手机样式、手机名、iccid、bssid、MAC地址、IMSI、IMEI",
          policy: "https://privacy.qq.com/policy/tencent-privacypolicy"
        },
        {
          name: "支付宝",
          tripartite: "支付宝(中国）网络技术有限公司",
          objective: "用于支付",
          mode: "采取去标识化和加密的安全处理方式",
          information:
            "设备版本、系统版本、生成ID、手机样式、手机名、iccid、bssid、MAC地址、IMSI、IMEI",
          policy: "Wifi信息客户端 SDK 隐私说明 - 支付宝文档中心 (alipay.com)"
        },
        {
          name: "友盟SDK",
          tripartite: "友盟同欣（北京）科技有限公司",
          objective: "用于消息推送、APP异常日志收集",
          mode: "采取去标识化和加密的安全处理方式",
          information:
            "设备信息（IMEI/MAC/Android ID/IDFA/OpenUDID/GUID/SIM卡IMSI/地理位置等）",
          policy: "https://www.umeng.com/page/policy"
        },
        {
          name: "腾讯TBS浏览器服务",
          tripartite: "深圳市腾讯计算机系统有限公司",
          objective: "加载网页",
          mode: "SDK本机采集，不涉及数据共享",
          information:
            "Wifi信息、MAC地址、IMSI、bssid、IMEI、设备序列号、android_id",
          policy: "https://x5.tencent.com/tbs/policy.html"
        }
      ]
    };
  },
  methods: {
    insert: function() {
      this.users.push(this.user);
    },
    remove: function(index) {
      this.users.splice(index, 1);
    }
  }
};
</script>

<style lang="less" scoped>
.shared {
    .tab{
        width: 100%;
        .tab_qin{
            width: 100%;
            height: 86px;
            line-height: 86px;
            text-align: center;
            margin: 0 auto;
            color: #000000;
            font-weight: bold;
            font-size: 34px;
        }
    }
  #cust {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 98%;
    margin: 0 auto;
  }

  #cust td,
  #cust th {
    border: 1px solid #ddd;
    padding: 8px;
  }
   #cust td.information{
       width: 120px;
       word-break:break-all;
   }

   #cust td.policy{
       width: 130px;
       word-break:break-all;
   }

  #cust tr:nth-child(even) {
    background-color: #f2f2f2;
  }

  #cust tr:hover {
    background-color: #ddd;
  }

  #cust th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: center;
    // background-color: #4caf50;
    color: #000;
  }

  .title {
    color: #000000;
    font-size: 30px;
    font-weight: 500;
    padding: 10px;
    // font-style: italic;
    font-family: cursive;
  }
  .centar {
    color: #2e2e2e;
    font-size: 30px;
    padding: 10px;
    font-family: cursive;
  }
  .title_name {
    font-size: 32px;
    color: #000000;
    text-align: center;
  }
}
</style>
